<div class="container">
  <div class="row gap-y">
    <div class="col-lg-12 b-r">
      <div class="row gap-y">
        {{#each data.list}}

          <!-- <a href="{{this.data.url}}"> -->

            <div class="col-md-6">
              <div class="card card-blog shadow-box shadow-hover border-0">
                <!-- <a href="{{this.data.url}}"
                ><img
                  class="card-img-top img-responsive"
                  src="{{this.data.image}}"
                  alt=""
              /></a> -->
                <div class="card-body">
                  <div
                    class="d-flex align-items-center justify-content-between"
                  >
                    <!-- <div class="author d-flex align-items-center">
                    <img
                      class="author-picture rounded-circle icon-md shadow-box"
                      src="/assets/uploads/lane-profile-mini.jpeg"
                      alt="Author profile"
                    />
                    <p class="small bold my-0">{{this.data.displayName}}</p>
                  </div> -->
                    <!-- <nav class="nav">
                    <a
                      href="javascript:;"
                      class="d-flex align-items-center text-secondary mr-3 blog-action blog-favorite"
                      ><i class="fas fa-heart text-danger mr-2"></i>
                      <span class="small">347</span> </a
                    ><a
                      href="javascript:;"
                      class="d-flex align-items-center text-secondary blog-action blog-bookmark"
                      ><i class="far fa-bookmark mr-2"></i>
                      <span class="small">73</span></a
                    >
                  </nav> -->
    
                    {{#if this.data.rumbleLink}}
                      <iframe
                        class="rumble"
                        width="100%"
                        src="{{this.data.rumbleLink}}"
                        frameborder="0"
                        allowfullscreen
                      ></iframe>

                      <!-- <script
                      >!function(r,u,m,b,l,e){r._Rumble=b,r[b]||(r[b]=function(){(r[b]._=r[b]._||[]).push(arguments);if(r[b]._.length==1){l=u.createElement(m),e=u.getElementsByTagName(m)[0],l.async=1,l.src="https://rumble.com/embedJS/ul8imb"+(arguments[1].video?'.'+arguments[1].video:'')+"/?url="+encodeURIComponent(location.href)+"&args="+encodeURIComponent(JSON.stringify([].slice.apply(arguments))),e.parentNode.insertBefore(l,e)}})}(window,
                        document, "script", "Rumble");</script>

                      <div id="rumble_ve4g5l"></div>
                      <script>
                        Rumble("play",
                        {"video":"ve4g5l","div":"rumble_ve4g5l"});</script> -->

                    {{/if}}
                  </div>

                  <p class="card-title regular">
                    <span href="#">{{this.data.displayName}}</span>
                  </p>
                  <hr />

                  <p class="card-text text-secondary">
                    {{this.data.message}}
                  </p>
                  <p class="bold small text-secondary my-0">
                    <small>{{this.data.createdOnFormatted}}</small>
                  </p>
                </div>
              </div>
            </div>

          </a>

        {{/each}}
      </div>
      <nav class="nav justify-content-center mt-5">
        <!-- <a class="btn btn-contrast btn-rounded mr-5" href="#"
            ><i class="fas fa-angle-left"></i> Previous</a
          > -->
        <a class="btn btn-contrast btn-rounded" href="#">Next
          <i class="fas fa-angle-right"></i></a>
      </nav>
    </div>
  </div>
</div>